feat(material): let every surface wear glass, not only Card - #240
Closed
pathscale wants to merge 2 commits into
Closed
feat(material): let every surface wear glass, not only Card#240pathscale wants to merge 2 commits into
pathscale wants to merge 2 commits into
Conversation
added 2 commits
August 16, 2026 14:33
Glass was a real material with one consumer. `styles/glass.ts` derives twenty-five `--glass-*` tokens from three numbers, and the only component that could read them was Card, so an app whose panels are dialogs, drawers, popovers or a navbar could set the tokens and see nothing change. `material` moves into the shared vocabulary and onto Dialog.Content, Drawer.Content, Popover.Content, Menu and Navbar. `solid` is the default on all of them, so this adds a capability without changing a single existing render. The rules live in `_shared/material.css`, keyed on `[data-material="glass"]` rather than a per-component class. Card had them inline, and copying that block five more times would be six places to update the next time the glass vocabulary moves - which it already did once, from thirty-one hand-declared properties to three numbers. Card now carries the attribute too and keeps its own classes, so its appearance is unchanged while the definition is shared. Three behaviours come along because they belong to the material rather than to any one component: nested glass is flattened to a single pane, since blurring already-blurred output is muddy rather than deeper and costs a second pass; and both `prefers-reduced-transparency` and a browser without `backdrop-filter` fall back to an opaque fill, because a tint with no blur behind it is a surface you cannot read text on. Every `--glass-*` read carries a fallback. An undefined custom property makes CSS drop the whole declaration rather than fall back to an initial value, which is how a partial token set used to produce a surface with no background at all. `CardMaterial` stays as a deprecated alias of `Material`. It is exported, it has always had exactly these two members, and removing it would break call sites for no gain.
`*.generated.tsx` is gitignored and `layouts:generate` only ever adds, so removing a component leaves its generated file behind, still importing the `.recipe` and `.layout` that went with it. Nothing notices: the file is invisible to `git status`, and the failure surfaces much later as tsc errors inside a file nobody edited. 2.5.0 shipped with twenty-two of them. `bun run check` read them as components and reported "missing index.ts barrel export" for things that no longer exist, which is how the gate spent a release red for a reason that pointed nowhere, and `bun run build` failed generating declarations. A twenty-third under `table/` survived the first sweep because it sits in a directory that is still alive. Checked here because this script already walks every component directory, and because a gate that names the actual file and says it is deletable build output costs one line to act on.
This was referenced Aug 16, 2026
Owner
Author
|
Superseded by #242, which now targets |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Glass was a real material with one consumer.
styles/glass.tsderives twenty-five--glass-*tokens from three numbers, and the only component that could read them wasCard— so an app whose panels are dialogs, drawers, popovers or a navbar could set the tokens and see nothing change.What this does
materialmoves into the shared vocabulary and onto Dialog.Content, Drawer.Content, Popover.Content, Menu and Navbar.solidis the default on all of them, so this adds a capability without changing a single existing render.The rules live in
_shared/material.css, keyed on[data-material="glass"]rather than a per-component class.Cardhad them inline, and copying that block five more times would be six places to update the next time the glass vocabulary moves — which it already did once, from thirty-one hand-declared properties to three numbers.Cardnow carries the attribute too and keeps its own classes, so its appearance is unchanged while the definition is shared.Three behaviours come along because they belong to the material rather than to any one component:
prefers-reduced-transparencyfalls back to an opaque fillbackdrop-filterEvery
--glass-*read carries a fallback. An undefined custom property makes CSS drop the whole declaration rather than fall back to an initial value, which is how a partial token set used to produce a surface with no background at all.CardMaterialstays as a deprecated alias ofMaterial. It is exported, it has always had exactly these two members, and removing it would break call sites for no gain.Also: 2.5.0 could not build
*.generated.tsxis gitignored andlayouts:generateonly ever adds, so removing a component leaves its generated file behind, still importing the.recipeand.layoutthat went with it.2.5.0 shipped with twenty-two of them, plus a twenty-third under
table/.bun run checkread them as components and reported "missing index.ts barrel export" for things that no longer exist;bun run buildfailed generating declarations. They are cleared here, andcheck-contracts.tsgained astale-generatedrule so the next deletion is caught at the gate with an actionable message instead of as tsc noise in a file invisible togit status.docs/ui-usage.mdalso still listedSurface,GlassPanel,ScrollShadow,EmptyStateandFloatingDock, all deleted. Corrected, and a Glass section added.Verification
bun run check— 90/90 components passbun run build— clean (was failing on master)bun test— 85/85 passdocs/api-contract.mdregenerated viabun run check:api -- --writeVersion bumped to 2.6.0: new public API, no breaking change.